<!-- 模块说明 -->
<template>
  <div class="box">
    <div class="paper">试卷中心</div>
    <ul>
      <li @click="ToDo(item)" v-for="item in PaperList">
        <h1 style="font-size: 20px;">{{ item.name }}</h1>
        <p style="margin-top: 10px;">学科：{{ subjectfn(item) }}</p>
        <p>试卷类型：{{ paperfn(item) }}</p>
        <p>题目数量：{{ item.titleItems.length }}</p>
        <p>试卷总分：{{ item.score }}</p>
        <p>考试时长：{{ item.suggestTime }}分钟</p>
      </li>
    </ul>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from "vue";
import { getPaperList } from "../../api/index";
import { useRouter } from 'vue-router'
const router = useRouter()
// const route = useRoute()
const PaperList = ref<any[]>([]);
const getPaper = async () => {
  let res = await getPaperList();
  console.log(res);

  PaperList.value = res.data;
};
const subjectfn = (row: any) => {
  if (row.subjectId == 1) {
    return "语文";
  } else if (row.subjectId == 2) {
    return "数学";
  } else if (row.subjectId == 3) {
    return "英语";
  } else if (row.subjectId == 4) {
    return "自然";
  }
};
const paperfn = (row: any) => {
  if (row.paperType == 1) {
    return "固定试卷";
  } else if (row.paperType == 2) {
    return "时段试卷";
  } else if (row.paperType == 3) {
    return "任务试卷";
  } else if (row.paperType == 4) {
    return "视频试卷";
  }
};
const ToDo = (item:any) => {
  // console.log(route);
  router.push({path:'/do', query: {id: item.id}})
}
onMounted(() => {
  getPaper();
});
</script>
<style lang="scss" scoped>
.box {
  position: relative;
  .paper {
    position: absolute;
    left: -20px;
    top: 10px;
    font-size: 16px;
    background-color: rgb(140, 189, 164);
    color: #fff;
    padding: 10px 25px 10px 25px;
    border-radius: 6px;
  }
  ul {
    display: flex;
    padding: 30px;
    padding-top: 60px;
    background-color: #e3e3e3;
    li {
      padding: 20px;
      width: 300px;
      height: 220px;
      margin-right: 20px;
      background-color: #fff;
      border: 1px solid #e3e3e3;
      p {
        font-size: 14px;
        line-height: 30px;
      }
    }
  }
}
</style>
